<template>
  <el-dialog
      :visible.sync="dialogVisible"
      width="600px"
      :before-close="closeDialog"
      append-to-body
      title="终止流程"
  >


    <el-form :label-position="labelPosition" label-width="70px" ref="form" v-loading="loading">
      <el-form-item prop="nextNodes" label="终止原因">
        <el-input size="small" type="textarea" placeholder="请输入原因" rows="6" v-model="terminationParam.suggest"
                  style="width: 450px"></el-input>
      </el-form-item>

    </el-form>
    <div class="btn-group">
      <el-button type="text" size="small" plain @click="closeDialog">取消</el-button>
      <el-button type="primary" size="small" :disabled="loading" @click="submit">确定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {termination} from "@/api/workflowInstance"

export default {
  components: {},
  data() {
    return {

      labelPosition: 'left',
      dialogVisible: false,
      loading: false,
      workflowDetail: {},
      terminationParam: this.defaultParam(),
    }
  },
  created() {
  },
  methods: {
    defaultParam() {
      return {
        processId: "",
        processInstanceId: "",
        taskId: "",
        account: "",
        suggest: ""
      };
    },
    async submit() {
      this.terminationParam.processId = this.workflowDetail.details.processId;
      this.terminationParam.processInstanceId = this.workflowDetail.details.processInstanceId;
      this.terminationParam.taskId = this.workflowDetail.details.taskId;
      let ret = await termination(this.terminationParam);
      if (ret.code === '200') {
        this.$message.success("终止成功");
        this.closeDialog();
      } else {
        this.$message.error(ret.message);
      }
    },

    showDialog(row) {
      this.terminationParam = this.defaultParam();
      this.dialogVisible = true
      this.workflowDetail = row;
    },
    closeDialog() {
      this.dialogVisible = false
      this.loading = false
    },

  },

}
</script>


<style src="../../css/index.scss" lang="scss"></style>
<style lang="scss" scoped>
.search-item {
  float: left;
  margin: 0 20px 20px 0;

  span {
    color: #606266;
    font-size: 14px;
    margin-right: 0px;
  }
}

.workProcessClass {
  height: 500px;
  overflow: auto;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  background: white;
}

.btn-group {
  display: flex;
  justify-content: right;

  .el-button {
    width: 50px;
  }
}

</style>
